<!DOCTYPE html>
<html>
<head>
	<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
	<META HTTP-EQUIV="Expires" CONTENT="-1">
	<#include "../common/common.ftl"> 
	<#include "../common/jqplot.ftl">
	<title>需求</title>
	<link href="${req.getContextPath()}/css/slider.css" rel="stylesheet">
	<link href="${req.getContextPath()}/plugins/datepicker/css/datepicker.css" rel="stylesheet">
	<link href="${req.getContextPath()}/plugins/webuploader-0.1.5/webuploader.css" rel="stylesheet">
	<script type="text/javascript" src="${req.getContextPath()}/plugins/webuploader-0.1.5/webuploader.min.js"></script>
	<style>
	.popover {
		max-height: 500px;
		overflow-y: scroll;
	}
	
	.select-item {
		width: 60px;
	}

	.control-label input {
		vertical-align: top;
		margin-left: 2px
	}

	li.monitor-state {
		height: 10px;
	}
	.controls code {
		vertical-align: middle;
	}

	.datepicker {
		z-index:1151;
	}

	div.chart {
		border: 1px solid #878988;
		margin-bottom: 12px;
	}

	div.modal-body div.chart {
		border:1px solid #878988; 
		height:250px; 
		min-width:500px; 
		margin-bottom:12px; 
		padding:5px 
	}

	.table thead th {
		vertical-align: middle;
	}

	.jqplot-yaxis {
		margin-right: 20px;
	}

	.jqplot-xaxis {
		margin-top: 5px;
	} 

	.rampup-chart {
		width: 400px;
		height: 300px
	}

	div.div-host {
		border: 1px solid #D6D6D6;
		height: 50px;
		margin-bottom: 8px;
		overflow-y: scroll;
		border-radius: 3px 3px 3px 3px;
	}

	div.div-host .host {
		color: #666666;
		display: inline-block;
		margin-left: 7px;
		margin-top: 2px;
		margin-bottom: 2px;
	}

    .add-host-btn {
        margin-top:27px;
        margin-left:287px;
        position:absolute
    }

	i.expand {
        background: url('${req.getContextPath()}/img/icon_expand.png') no-repeat;
        display: inline-block;
		height: 16px;
		width: 16px;
		line-height: 16px;
		vertical-align: text-top;
	}

	i.collapse{
        background: url('${req.getContextPath()}/img/icon_collapse.png') no-repeat;
        display: inline-block;
		height: 16px;
		width: 16px;
		line-height: 16px;
		vertical-align: text-top;
	}

	#test_name + span {
		float: left;
	}

	#query_div label, #concurrentUser label, #testUrlContent label, #otherContent label {
		width: 100px;
	}

	.form-horizontal .control-group {
		margin-bottom:10px;
	}

	.controls .span3 {
		margin-left: 0;
	}

	.control-group.success td > label[for="test_name"] {
		color: #468847;
	}

	.control-group.error td > label[for="test_name"] {
		color: #B94A48;
	}

	#script_control.error .select2-choice {
		border-color: #B94A48;
		color: #B94A48;
	}

	#script_control.success .select2-choice {
		border-color: #468847;
		color: #468847;
	}

	legend {
		padding-top: 10px;
	}

	label.region {
		margin-left:-40px;
	}

	.span4-5 {
		width: 340px;
	}
	.span3-4 {
		width: 260px;
	}
	.span2-3 {
		width: 180px;
	}

	#thelist { margin: 0; padding: 0; padding-right: 30px; list-style: none; }
	#thelist li { padding: 5px; font-weight: bold; margin: 5px 0; }
	#thelist li button { float: right }

	.btn-xs { padding: 1px 5px; }
	
	select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { margin-bottom: 0; }
	</style>
</head>

<body>
<div id="wrap">
	<#include "../common/navigator.ftl">
	<div class="container">
		<form id="test_demand_form" name="test_demand_form" action="${req.getContextPath()}/demand/new"  method="POST">
			<input type="hidden" name="date" id="dateId">
			<input type="hidden" name="id" value="${(test.id)!}">
			<div class="well" style="margin-bottom: 5px;margin-top:10px">
				
				<div class="form-horizontal" id="query_div">
					<fieldset>
						<div class="control-group">
							<div class="row">
								<div class="span5">
									<@control_group name = "project_name" controls_style = "margin-left: 120px;" label_message_key = "脚本目录">
										<input 
										data-content= "名称必须以字母开头，可以包括字母，数字，\'.\'，\'_\'和\'-\'，最短3位，最长20位。"
										rel="create_folder_modal_popover"
		data-html="true"
		data-placement="right" class="required span3 left-float" maxlength="80" size="50" type="text" id="project_name" name="projectName" value="${(test.projectName)!}"/>
									</@control_group>
								</div>
								<div class="span5">
									<@control_group name = "ver" label_style = "width:120px;" controls_style = "margin-left: 40px;" label_message_key = "版本（标签）">
										<input class="span2-3 required" size="50" type="text" id="ver" name="ver" value="${(test.ver)!}">
									</@control_group>
								</div>
								<div class="span1" style="margin-left:0">
									<div class="control-group">
										<button type="button" class="btn btn-success" id="save_test_btn" style="width:55px">
											保存
										</button>
									</div>
								</div>
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label for="project_name_cn" class="control-label">项目(中文)</label>
							<div class="controls" style="margin-left: 120px;">
								<input type="text" class="required" style="width: 751px;" id="project_name_cn" name="projectNameCn" value="${(test.projectNameCn)!}">
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label for="test_prupose" class="control-label">测试目的</label>
							<div class="controls" style="margin-left: 120px;">
								<textarea id="test_prupose" name="testPrupose" class="required" style="resize: none; width:751px; height:36px">${(test.testPrupose)!}</textarea>
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label for="test_info" class="control-label">测试内容</label>
							<div class="controls" style="margin-left: 120px;">
								<textarea id="test_info" name="testInfo" class="required" style="resize: none; width:751px; height:36px">${(test.testInfo)!}</textarea>
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label class="control-label" for="test_files">测试相关文档</label>
							<div class="controls" style="margin-left: 120px;">
								<input type="hidden" name="testFiles" id="test_files">

								<div id="uploader" class="wu-example">
								    <!--用来存放文件信息-->
								    <ul id="thelist" class="uploader-list"></ul>
								    <div class="btns">
								        <div id="picker">选择上传文件...</div>
								    </div>
								</div>
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label for="test_env" class="control-label">测试环境</label>
							<div class="controls" style="margin-left: 120px;">							
								<select id="test_env" name="testEnv" class="required">
									<option value="">选择测试环境</option>
									<option <#if (test.testEnv)?? && test.testEnv = '无锡压测环境'>selected</#if> value="无锡压测环境">无锡压测环境</option>
									<option <#if (test.testEnv)?? && test.testEnv = '长乐压测环境'>selected</#if> value="长乐压测环境">长乐压测环境</option>
									<option <#if (test.testEnv)?? && test.testEnv = '内网压测环境'>selected</#if> value="内网压测环境">内网压测环境</option>
									<option <#if (test.testEnv)?? && test.testEnv = '其它'>selected</#if> value="其它">其它</option>
								</select>
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label for="test_env_info" class="control-label">测试环境说明</label>
							<div class="controls" style="margin-left: 120px;">
								<input type="text" style="width: 751px;" id="test_env_info" name="testEnvInfo" value="${(test.testEnvInfo)!}">
							</div>
						</div>
						
					</fieldset>

					
				</div>
			</div>
			<!-- end well -->
			
			<div class="well" style="margin-bottom: 5px;margin-top:10px" id="concurrentUser">
				<div class="form-horizontal">
					<fieldset> 
						<legend style="padding: 0; margin: 0;">性能指标</legend>
						<div class="control-group">
							<div class="row">
								<div class="span3-4">
									<@control_group name = "vuser" controls_style = "margin-left: 120px;" label_message_key = "并发用户数">
										<input class="required" id="vuser" name="vuser" style="width:100px;" type="text" value="${(test.vuser)!}"/>
									</@control_group>
								</div>
								<div class="span4-5">
									<@control_group name = "responsetime" label_style = "width:120px;" controls_style = "margin-left: 40px;" label_message_key = "平均响应时间">
										<input class="required" type="text" id="responsetime" name="responsetime" style="margin-left:10px; width:100px;" value="${(test.responsetime)!}">
									</@control_group>
								</div>
								<div class="span3-4" style="margin-left:0">
									<@control_group name = "succ_rate" label_style = "width:80px;" controls_style = "margin-left: 40px;" label_message_key = "成功率（%）">
										<input class="required" type="text" id="succ_rate" name="succRate" style="width:100px;" value="${(test.succRate)!}">
									</@control_group>
								</div>
							</div>
						</div>
					</fieldset>
				</div>
			</div>

			<div class="well" style="margin-bottom: 5px;margin-top:10px" id="testUrlContent">
				<div class="form-horizontal">
					<fieldset> 
						<legend style="padding: 0; margin: 0;">
							<span style="float: right;margin-right: 5px;">
								<button type="button" class="btn btn-primary" id="add_test_url_btn" style="width:85px">
									+增加
								</button>
							</span>
							测试内容
						</legend>
						<input type="hidden" name="testInfoList" id="test_info_list">
						<input type="hidden" id="testInfoListNum" value="1">

						<div style="margin-top: 10px;" id="test_info_list_id">
							<!-- <div class="control-group" style="margin-bottom: 10px">	
								<div class="controls" style="margin-left: 20px;">
									<input type="text" readonly value="T01" name="test_info_list_name" class="test_info_list_name" placeholder="名称" style="width: 250px;">
									<input type="text" name="test_info_list_url" class="test_info_list_url" placeholder="URL" style="width: 350px;">
									<select placeholder="请求类型" name="test_info_list_type" class="test_info_list_type" style="width: 100px;">
										<option value="GET">GET</option>
										<option value="POST">POST</option>
									</select>
								</div>
							</div> -->
						</div>
					</fieldset>
				</div>
			</div>


			<div class="well" style="margin-bottom: 5px;margin-top:10px" id="otherContent">
				<div class="form-horizontal">
					<fieldset> 						
						<div class="control-group" style="margin-bottom: 10px">
							<label for="requireman" class="control-label">需求提交人</label>
							<div class="controls" style="margin-left: 120px;">
								<input class="required" name="requireman" id="requireman" type="text" value="${(test.requireman)!}">
							</div>
						</div>
						<div class="control-group" style="margin-bottom: 10px">
							<label for="peoples" class="control-label">测试接口人</label>
							<div class="controls" style="margin-left: 120px;">
								<input type="text" class="required" id="peoples" name="peoples" style="width: 400px;" value="${(test.peoples)!}"> <code>(相关人员）</code>
							</div>
						</div>
					</fieldset>
				</div>
			</div>

		</form>
	</div>
	<!--end container-->

	
</div>


	<!-- Modal -->
    <div class="modal fade" id="highAttrModal" tabindex="-1" role="dialog" style="width: 800px;display:none" aria-labelledby="highAttrModalLabel">
    	<input type="hidden" id="highAttrId">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="highAttrModalLabel">高级属性</h4>
                </div>
                <div class="modal-body">
                    <ul class="nav nav-tabs" role="tablist">
                        <li role="presentation" class="active"><a href="#attr-param" aria-controls="attr-param" role="tab" data-toggle="tab">参数</a></li>
                        <li role="presentation"><a href="#attr-header" aria-controls="attr-header" role="tab" data-toggle="tab">Header</a></li>
                        <li role="presentation"><a href="#attr-check" aria-controls="attr-check" role="tab" data-toggle="tab">检查点</a></li>
                    </ul>
                    <div class="tab-content">
                    	<div role="tabpanel" class="tab-pane active" id="attr-param">
                        	<table class="table table-bordered">
                        		<thead> 
		                            <tr>
		                            	<th width="60" style="text-align:center"><button type="button" id="btnAddParams" class="btn btn-success btn-xs">+ 增加</button></th>
		                                <th>参数键名</th>
		                                <th>参数值</th>
		                                <th width="60">操作</th>
		                            </tr>
	                            </thead>
	                            <tbody id="attr-param-tbody">
		                            <!-- <tr>
		                            	<td colspan="2"><input type="text"></td>
		                            	<td><input type="text"></td>
		                            	<td style="text-align:center"><button type="button" class="btn btn-danger btn-xs">- 删除</button></td>
		                            </tr> -->
	                            </tbody>
	                            <tfoot>
	                            	<tr>
	                            		<td colspan="4">
	                            			<select class="input-xs" id="paramsType">
	                            				<option value="json">JSON格式</option>
	                            				<option value="kv">键值对格式</option>
	                            			</select>
	                            		</td>
	                            	</tr>
	                            </tfoot>
                            </table>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="attr-header">
                        	<table class="table table-bordered">
                        		<thead>
		                            <tr>
		                            	<th width="60" style="text-align:center"><button type="button" id="btnAddHeaders" class="btn btn-success btn-xs">+ 增加</button></th>
		                                <th>Header名称</th>
		                                <th>Header值</th>
		                                <th>操作</th>
		                            </tr>
	                            </thead>
	                            <tbody id="attr-header-tbody">
		                            <!-- <tr>
		                            	<td><input type="text" ></td>
		                            	<td><input type="text" ></td>
		                            	<td></td>
		                            </tr> -->
	                            </tbody>
                            </table>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="attr-check">
                        	<input type="text" id="checkStr" style="width: 98%">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">            
                    <button type="button" class="btn btn-primary" id="btnSaveModalValue">确定</button>
                </div>
            </div>
        </div>
    </div>

<#include "../common/copyright.ftl">
<script src="${req.getContextPath()}/plugins/datepicker/js/bootstrap-datepicker.js"></script>
<script src="${req.getContextPath()}/js/bootstrap-slider.min.js"></script>
<script src="${req.getContextPath()}/js/jquery.form.js"></script>
<script src="${req.getContextPath()}/js/ramp_up.js?${nGrinderVersion}"></script>

    <script>
    	var BASE_URL = '${req.getContextPath()}/plugins/webuploader-0.1.5';
    	var BASE_UPLOAD_URL = '${req.getContextPath()}/';
    	var ARR_FILE_UPLOAD = new Array();
    	var uploader = WebUploader.create({
    		//设置文件上传域的name
    		fileVal: 'uploadFile',
		    // swf文件路径
		    swf: BASE_URL + '/Uploader.swf',
		    // 文件接收服务端。
		    server: '${req.getContextPath()}/demand/upload',
		    // 选择文件的按钮。可选。
		    // 内部根据当前运行是创建，可能是input元素，也可能是flash.
		    pick: '#picker',
		    // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
		    resize: false,
		    // 选完文件后，是否自动上传。
		    auto: true
		});

		uploader.on( 'uploadSuccess', function( file, response ) {
			addUploadFile(response.path);
		});

		var G_highAttrValue = {};

		$(document).ready(function(){
			$("#nav_demand").addClass("active");

			addValidation();
			<#if (test.testFiles)?? && test.testFiles != ''>
			getUploadFileList();
			</#if>
			<#if (test.testInfoList)?? && test.testInfoList != ''>
			getTestInfoList();
			</#if>


			$("input[rel='create_folder_modal_popover']").popover({trigger: 'focus', container:'#query_div'});
			$('#save_test_btn').click(function() {	
				var $projectname = $("#project_name");
				if (checkEmptyByObj($projectname)) {
					markInput($projectname, false, "该选项不能为空。");
					return;
				} else {
					if (!checkSimpleNameByObj($projectname)) {
						markInput($projectname, false, "该内容格式出错。");
						return;
					}
					markInput($projectname, true);
				}

				if (!getTestInfoListJson()) {
					bootbox.alert("测试内容 URL 格式错误", "<@spring.message "common.button.ok"/>");

					return false;
				}
				var nowDate = new Date();
				$('#dateId').val(nowDate.getFullYear() + '-' + nowDate.getMonth() + '-' + nowDate.getDate());

				
				var arr_upload = new Array();

				$('#thelist li a').each(function(idx) {
					arr_upload[idx] = $(this).text();
				})
				if (arr_upload.length > 0) {
					$('#test_files').val(JSON.stringify(arr_upload));
				}
				

				$("#test_demand_form").submit();
			})

			$('#add_test_url_btn').click(function() {
				addTestInfoList();
			})

			
			$("#test_info_list_id").on("click",".delete_test_info", function () { 
				// console.log('test');
				$(this).parent().parent().remove();
			})

			$("#thelist").on("click",".btn-delete-upload", function () {						
				$(this).parent().remove();
			})

			$("#test_info_list_id").on("click",".highattr", function () { 
				var attrId = $(this).attr('data-whatever');
				$('#highAttrId').val(attrId);
				$('#attr-param-tbody').html('');
				$('#attr-header-tbody').html('');
				$('#checkStr').val('');

				if (G_highAttrValue && G_highAttrValue[attrId]) {
					var params = G_highAttrValue[attrId].params;
					var headers = G_highAttrValue[attrId].headers;
					if (params) {
						$.each(params, function(i) {
							addParams(params[i].paramsKey, params[i].paramsValue);	
						})
					}

					if (headers) {
						$.each(headers, function(i) {
							addHeaders(headers[i].headersKey, headers[i].headersValue);	
						})
					}

					if (G_highAttrValue[attrId].paramsType) {
						$('#paramsType').val(G_highAttrValue[attrId].paramsType);
					} else {
						$('#paramsType').val('json');
					}
					$('#checkStr').val(G_highAttrValue[attrId].checkStr);
				}

				$('#highAttrModal').modal('show');
			})
			
			

			$('#btnAddParams').click(function() {	
				addParams();
			})

			$('#btnAddHeaders').click(function() {	
				addHeaders();
			})

			$("#attr-param-tbody").on("click",".btnDeleteParams", function () {						
				$(this).parent().parent().remove();
			})

			$('#btnSaveModalValue').click(function() {	
				var paramsJson = new Array();
				var jsons = {};
				var headersJson = new Array();
				var headersJsons = {};
				var attrId = $('#highAttrId').val();

				$('#attr-param-tbody tr').each(function(i) {
					var key = $(this).find('.paramsKey').val().trim();
					var val = $(this).find('.paramsValue').val().trim();

					if (key && val) {
						var json = {};
	                    json.paramsKey = key;
	                    json.paramsValue = val;

	                    paramsJson.push(json);
	                }
				})

				$('#attr-header-tbody tr').each(function(i) {
					var key = $(this).find('.headersKey').val().trim();
					var val = $(this).find('.headersValue').val().trim();

					if (key && val) {
						var json = {};
	                    json.headersKey = key;
	                    json.headersValue = val;

	                    headersJson.push(json);
	                }
				})

				jsons.params = paramsJson;
				jsons.paramsType = $('#paramsType').val();
				jsons.headers = headersJson;
				jsons.checkStr = $('#checkStr').val();
				
				G_highAttrValue[attrId] = jsons;


				$('#highAttrModal').modal('hide')
			})
			

		});

		function addParams(key, val) {
			var html = '<tr>';
	        html += '<td colspan="2"><input type="text" class="paramsKey" value="'+ (key ? key : '') +'" style="width: 96%"></td>';
	        html += '<td><input type="text" class="paramsValue" value="'+ (val ? val : '') +'" style="width: 96%"></td>';
	        html += '<td style="text-align:center"><button type="button" class="btn btn-danger btn-xs btnDeleteParams">- 删除</button></td>';
	        html += '</tr>';


	        $('#attr-param-tbody').append(html);
		}

		function addHeaders(key, val) {
			var html = '<tr>';
	        html += '<td colspan="2"><input type="text" class="headersKey" value="'+ (key ? key : '') +'" style="width: 96%"></td>';
	        html += '<td><input type="text" class="headersValue" value="'+ (val ? val : '') +'" style="width: 96%"></td>';
	        html += '<td style="text-align:center"><button type="button" class="btn btn-danger btn-xs btnDeleteHeaders">- 删除</button></td>';
	        html += '</tr>';


	        $('#attr-header-tbody').append(html);
		}

		function addUploadFile(path) {
			var html = '<li><a title="点击查看或下载" href="'+ BASE_UPLOAD_URL + path +'" target="_blank">'+ path +'</a> <button type="button" class="btn btn-danger btn-xs btn-delete-upload"> - 删除</button></li>';

			$('#thelist').append(html);
		}

		function getUploadFileList() {
			var fileJson = <#if (test.testFiles)?? && test.testFiles != ''>${test.testFiles}<#else>[]</#if>;

			$.each(fileJson, function(i) {
				addUploadFile(fileJson[i]);
			})
		}

		function getTestInfoList() {
			var infoJson = <#if (test.testInfoList)?? && test.testInfoList != ''>${test.testInfoList}<#else>[]</#if>;
			<#if (test.testInfoList)?? && test.testInfoList != ''>
			$('#test_info_list_id').html('');
			</#if>


			var maxIdx = 1;
			$.each(infoJson, function(i) {				
				addTestInfoList(infoJson[i].name, infoJson[i].url, infoJson[i].type, 1, infoJson[i].submitInfo);

				if (infoJson[i].name.indexOf('T') == 0) {
					var num = parseInt(infoJson[i].name.replace('T', ''));
					
					if (!isNaN(num) && num > maxIdx) {
						maxIdx = num;
					}
				}

				if (infoJson[i].heightAttr) {
					var heightAttr = infoJson[i].heightAttr;

					G_highAttrValue[infoJson[i].name] = heightAttr;
				} else {
					G_highAttrValue[infoJson[i].name] = [];
				}
			})

			// console.log(G_highAttrValue);

			$('#testInfoListNum').val(maxIdx + 1);
		}


		function getTestInfoListJson() {
			var jsonMap = new Array();

			var tf = true;
			$('#test_info_list_id .controls').each(function(idx) {
				var name = $(this).find('.test_info_list_name').val();
				var url = $(this).find('.test_info_list_url').val();
				var type = $(this).find('.test_info_list_type').val();
				var readonly = $(this).find('.test_info_list_readonly').val();
				var submitInfo = $(this).find('.test_info_list_submit_info').val();

				if (!checkURL(url)) {
					tf = false;
				}

				var heightAttr = (G_highAttrValue[name] && G_highAttrValue[name]['params']) ? G_highAttrValue[name] : {'params' : [], 'paramsType' : 'json', 'headers' : [], 'checkStr' : ''};
				
				jsonMap[idx] = { 'name' : name, 'url' : url, 'type' : type, 'readonly' : readonly, 'heightAttr' : heightAttr, 'submitInfo' : submitInfo };
			})

			console.log(JSON.stringify(jsonMap));

			if (jsonMap.length > 0) {
				$('#test_info_list').val(JSON.stringify(jsonMap));
			}

			return tf;
		}

		function getTestInfoListName() {
			var idx = parseInt($('#testInfoListNum').val());

			console.log(idx);
			$('#testInfoListNum').val(idx + 1);
			return "T" + (idx < 10 ? "0" + idx : idx);
		}

		function addTestInfoList(name, url, type, readonly, submitInfo) {
			var inputVal = name ? name : getTestInfoListName();
			var html = '<div class="control-group" style="margin-bottom: 10px">';
			html += '<div class="controls" style="margin-left: 20px;">';
			html += '<input type="text" readonly value="'+ (inputVal) +'" name="test_info_list_name" class="test_info_list_name" placeholder="名称" style="width: 40px;"> ';
			html += '<input type="text" value="'+ (url ? url : '') +'" name="test_info_list_url" class="test_info_list_url" placeholder="URL" style="width: 350px;"> ';
			html += '<input type="text" value="'+ (submitInfo ? submitInfo : '') +'" name="test_info_list_submit_info" class="test_info_list_submit_info" placeholder="提交信息" style="width: 150px;"> ';
			html += '<select placeholder="请求类型" name="test_info_list_type" class="test_info_list_type" style="width: 80px;"> ';
			html += '<option '+ (type && type == 'GET' ? 'selected' : '') +' value="GET">GET</option>';
			html += '<option '+ (type && type == 'POST' ? 'selected' : '') +' value="POST">POST</option>';
			html += '</select> ';
			html += '<input type="hidden" name="test_info_list_readonly" class="test_info_list_readonly" value="'+ (readonly ? 1 : 0) +'"> ';
			html += '<button type="button" class="btn btn-info btn-xs highattr" data-whatever="'+ (inputVal) +'" style="width:85px">高级属性</button> ';
			html += '<button type="button" class="btn btn-danger btn-xs delete_test_info" style="width:85px">- 删除</button>';
			html += '</div>';
			html += '</div>';

			$('#test_info_list_id').append(html);
		}

		var validationOptions = {};
		function addValidation() {
			$.validator.addMethod("paramFmt", function (param) {
				var rule = /^[a-zA-Z0-9_\.,\|=]{0,50}$/;
				return rule.test($.trim(param));
			});
			var $runCountRadio = $("#run_count_radio");
			$.validator.addMethod("runCount", function(value, element) {
				if ($runCountRadio.is(":checked")) {
					return value > 0;
				} else {
					return true;
				}
			});
		    //noinspection JSUnusedLocalSymbols,JSUnusedLocalSymbols
		    validationOptions = {
				rules: {
					projectName: { 
						required: true
					},
					vuser: {
						required: true,
						digits: true,
						min: 1
					},
				},
				messages: {
					projectName: {
						required: "项目名称必须填写"
					},
					vuser: {
						required: "并发用户数称必须填写"
					}
				},
				ignore : "", // make the validation on hidden input work
				errorClass : "help-inline",
				errorElement : "span",
				errorPlacement : function(error, element) {
					var errorPlace = $("td." + element.attr("id"));
					if (errorPlace[0]) {
						errorPlace.html(error);
						return;
					}
					errorPlace = $("#err_"+element.attr("id"));
					if (errorPlace[0]) {
						errorPlace.html(error);
					} else {
						var $elem = element.closest(".controls");
						if ($elem[0]) {
							$elem.append(error);
						} else {
							element.parent().append(error);
						}
					}
				},
				highlight : function(element, errorClass, validClass) {
					var $detailedSection = $(element).parents("#detail_config_section");
					if ($detailedSection.length >= 1) {
						$detailedSection.show();
					}
					var $controlGroup = $(element).parents('.control-group');
					if ($controlGroup.length >= 1) {
						$($controlGroup[0]).removeClass("success");
						$($controlGroup[0]).addClass("error");
					}
				},
				unhighlight : function(element, errorClass, validClass) {
					var $elem = $(element);
					var $controlGroup = $elem.parents('.control-group');
					if ($controlGroup.length >= 1) {
						var isSuccess = true;
						$elem.siblings("span.help-inline:visible").each(function() {
							if ($(this).attr("for") != $elem.attr("id")) {
								isSuccess = false;
							}
						});
						if (isSuccess) {
							$($controlGroup[0]).removeClass("error");
							$($controlGroup[0]).addClass("success");
						}
					}
				}
			};

			$("#test_demand_form").validate(validationOptions);
		}

		function checkURL(URL){
			var str=URL;
			//判断URL地址的正则表达式为:http(s)?://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?
			//下面的代码中应用了转义字符"\"输出一个字符"/"
			var Expression=/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
			var objExp=new RegExp(Expression);
			if(objExp.test(str)==true){
				return true;
			}else{
				return false;
			}
		} 
	</script>

	</body>
</html>
